<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
	<title>山西省第二十届眼科学术会议</title>
	<link rel="stylesheet" href="dist/stylesheets/chromagallery.min.css">
	<style type="text/css">
		body,html
		{ height: 100%; background-color: #fff; 		}
		.content
		{
			width: 100%;
			height: 100%;
			margin: 10px auto;
		}
		@media screen and (min-width: 980px) /* Desktop */ {
		  .content {
		    width: 70%;
		  }
		}		
		.mygallery
		{
			margin: 15px 0;
		}
		.select {
			position: relative;
			display: block;
			margin: 0 auto;
			width: 100%;
			color: #333;
			border:1px solid #9bc0dd;
			vertical-align: middle;
			text-align: left;
			user-select: none;
			-webkit-touch-callout: none;
			border-radius:2px;
			margin-top: 50px;
		}
		.select .placeholder {
			position: relative;
			display: block;
			background-color: #fafdfe;
			z-index: 1;
			padding: 5px;
			border-radius: 2px;
			cursor: pointer;
		}
		.select .placeholder:hover {
			background:#fafdfe;
		}
		.select .placeholder:after {
			position: absolute;
			right: 1em;
			top: 50%;
			transform: translateY(-51%);
			content: '▼';
			z-index: 10;
		}
		.select.is-open .placeholder:after {
			content: '▼';
		}
		.select.is-open ul {
			display: block;
		}
		.select.select--white .placeholder {
			background: #fff;
			color: #999;
		}
		.select.select--white .placeholder:hover {
			background: #fafafa;
		}
		.select ul {
			display: none;
			position: absolute;
			overflow: hidden;
			width: 100%;
			background: #a5dff3;
			border-radius: 2px;
			top: 100%;
			left: 0;
			list-style: none;
			margin: 5px 0 0 0;
			padding: 0;
			z-index: 100;
		}
		.select ul li {
			display: block;
			text-align: left;
			padding: 0.8em 1em 0.8em 1em;
			color: #333;
			cursor: pointer;
		}
		.select ul li:hover {
			background: #4ebbf0;
			color: #fff;
		}
	</style>
	<script type="text/javascript">
		/* 禁止ios浏览器缩放 */
		window.onload = function() {
			// 阻止双击放大
			var lastTouchEnd = 0;
			document.addEventListener('touchstart', function(event) {
				if (event.touches.length > 1) {
					event.preventDefault();
				}
			});
			document.addEventListener('touchend', function(event) {
				var now = (new Date()).getTime();
				if (now - lastTouchEnd <= 300) {
					event.preventDefault();
				}
				lastTouchEnd = now;
			}, false);
			
			// 阻止双指放大
			document.addEventListener('gesturestart', function(event) {
				event.preventDefault();
			});
		}
	</script>
</head>
<body>
	<div style="background:#26a2ff;font-size: 14px;height:40px;top: 0;
	right: 0;left: 0;position: fixed;z-index: 999;text-align: center;line-height: 40px;">
		<a href="/" style="position: absolute;top:0;left: 10px;color: #fff;text-decoration: none;">< 返回</a>
		<span style="color: #fff;">壁报资料</span>
	</div>
	<div class="select dowebok">
		<span class="placeholder">眼底+角膜屈光</span>
		<ul>
			<li>眼眶整形+小儿眼科+白内障+青光眼</li>
			<li>眼底+角膜屈光</li>
		</ul>
	</div>
	<article class="jq22-container">
		<div class="content">
			<div id="t1" class="chroma-gallery mygallery">
				<img class="t2" src="images/t2/thumbs/1.jpg" alt="Pic 1" data-largesrc="images/t2/1.jpg">
				<img class="t2" src="images/t2/thumbs/2.jpg" alt="Pic 2" data-largesrc="images/t2/2.jpg">
				<img class="t2" src="images/t2/thumbs/3.jpg" alt="Pic 3" data-largesrc="images/t2/3.jpg">
				<img class="t2" src="images/t2/thumbs/4.jpg" alt="Pic 4" data-largesrc="images/t2/4.jpg">
				<img class="t2" src="images/t2/thumbs/5.jpg" alt="Pic 5" data-largesrc="images/t2/5.jpg">
				<img class="t2" src="images/t2/thumbs/6.jpg" alt="Pic 6" data-largesrc="images/t2/6.jpg">
				<img class="t2" src="images/t2/thumbs/7.jpg" alt="Pic 7" data-largesrc="images/t2/7.jpg">
				<img class="t2" src="images/t2/thumbs/8.jpg" alt="Pic 8" data-largesrc="images/t2/8.jpg">
				<img class="t2" src="images/t2/thumbs/9.jpg" alt="Pic 9" data-largesrc="images/t2/9.jpg">
				<img class="t2" src="images/t2/thumbs/10.jpg" alt="Pic 10" data-largesrc="images/t2/10.jpg">
				<img class="t2" src="images/t2/thumbs/11.jpg" alt="Pic 11" data-largesrc="images/t2/11.jpg">
				<img class="t2" src="images/t2/thumbs/12.jpg" alt="Pic 12" data-largesrc="images/t2/12.jpg">
				<img class="t2" src="images/t2/thumbs/13.jpg" alt="Pic 13" data-largesrc="images/t2/13.jpg">
				<img class="t2" src="images/t2/thumbs/14.jpg" alt="Pic 14" data-largesrc="images/t2/14.jpg">
				<img class="t2" src="images/t2/thumbs/15.jpg" alt="Pic 15" data-largesrc="images/t2/15.jpg">
				<img class="t2" src="images/t2/thumbs/16.jpg" alt="Pic 16" data-largesrc="images/t2/16.jpg">
				<img class="t2" src="images/t2/thumbs/17.jpg" alt="Pic 17" data-largesrc="images/t2/17.jpg">
				<img class="t2" src="images/t2/thumbs/18.jpg" alt="Pic 18" data-largesrc="images/t2/18.jpg">
				<img class="t2" src="images/t2/thumbs/19.jpg" alt="Pic 19" data-largesrc="images/t2/19.jpg">
				<img class="t2" src="images/t2/thumbs/20.jpg" alt="Pic 20" data-largesrc="images/t2/20.jpg">
				<img class="t2" src="images/t2/thumbs/21.jpg" alt="Pic 21" data-largesrc="images/t2/21.jpg">
				<img class="t2" src="images/t2/thumbs/22.jpg" alt="Pic 22" data-largesrc="images/t2/22.jpg">
				<img class="t2" src="images/t2/thumbs/23.jpg" alt="Pic 23" data-largesrc="images/t2/23.jpg">
				<img class="t2" src="images/t2/thumbs/24.jpg" alt="Pic 24" data-largesrc="images/t2/24.jpg">
				<img class="t2" src="images/t2/thumbs/25.jpg" alt="Pic 25" data-largesrc="images/t2/25.jpg">
				<img class="t2" src="images/t2/thumbs/26.jpg" alt="Pic 26" data-largesrc="images/t2/26.jpg">
				<img class="t2" src="images/t2/thumbs/27.jpg" alt="Pic 27" data-largesrc="images/t2/27.jpg">
				<img class="t2" src="images/t2/thumbs/28.jpg" alt="Pic 28" data-largesrc="images/t2/28.jpg">
				<img class="t2" src="images/t2/thumbs/29.jpg" alt="Pic 29" data-largesrc="images/t2/29.jpg">
				<img class="t2" src="images/t2/thumbs/30.jpg" alt="Pic 30" data-largesrc="images/t2/30.jpg">
				<img class="t2" src="images/t2/thumbs/31.jpg" alt="Pic 31" data-largesrc="images/t2/31.jpg">
				<img class="t2" src="images/t2/thumbs/32.jpg" alt="Pic 32" data-largesrc="images/t2/32.jpg">
				<img class="t2" src="images/t2/thumbs/33.jpg" alt="Pic 33" data-largesrc="images/t2/33.jpg">
				<img class="t2" src="images/t2/thumbs/34.jpg" alt="Pic 34" data-largesrc="images/t2/34.jpg">
				<img class="t2" src="images/t2/thumbs/35.jpg" alt="Pic 35" data-largesrc="images/t2/35.jpg">
				<img class="t2" src="images/t2/thumbs/36.jpg" alt="Pic 36" data-largesrc="images/t2/36.jpg">
				<img class="t2" src="images/t2/thumbs/37.jpg" alt="Pic 37" data-largesrc="images/t2/37.jpg">
				<img class="t2" src="images/t2/thumbs/38.jpg" alt="Pic 38" data-largesrc="images/t2/38.jpg">
				<img class="t2" src="images/t2/thumbs/39.jpg" alt="Pic 39" data-largesrc="images/t2/39.jpg">
				<img class="t2" src="images/t2/thumbs/40.jpg" alt="Pic 40" data-largesrc="images/t2/40.jpg">
				<img class="t2" src="images/t2/thumbs/41.jpg" alt="Pic 41" data-largesrc="images/t2/41.jpg">
				<img class="t2" src="images/t2/thumbs/42.jpg" alt="Pic 42" data-largesrc="images/t2/42.jpg">
				<img class="t2" src="images/t2/thumbs/43.jpg" alt="Pic 43" data-largesrc="images/t2/43.jpg">
				<img class="t2" src="images/t2/thumbs/44.jpg" alt="Pic 44" data-largesrc="images/t2/44.jpg">
				<img class="t2" src="images/t2/thumbs/45.jpg" alt="Pic 45" data-largesrc="images/t2/45.jpg">
				<img class="t2" src="images/t2/thumbs/46.jpg" alt="Pic 46" data-largesrc="images/t2/46.jpg">
				<img class="t2" src="images/t2/thumbs/47.jpg" alt="Pic 47" data-largesrc="images/t2/47.jpg">
				<img class="t2" src="images/t2/thumbs/48.jpg" alt="Pic 48" data-largesrc="images/t2/48.jpg">
				<img class="t2" src="images/t2/thumbs/49.jpg" alt="Pic 49" data-largesrc="images/t2/49.jpg">
				<img class="t2" src="images/t2/thumbs/50.jpg" alt="Pic 50" data-largesrc="images/t2/50.jpg">
				<img class="t2" src="images/t2/thumbs/51.jpg" alt="Pic 51" data-largesrc="images/t2/51.jpg">
				<img class="t2" src="images/t2/thumbs/52.jpg" alt="Pic 52" data-largesrc="images/t2/52.jpg">
				<img class="t2" src="images/t2/thumbs/53.jpg" alt="Pic 53" data-largesrc="images/t2/53.jpg">
				<img class="t2" src="images/t2/thumbs/54.jpg" alt="Pic 54" data-largesrc="images/t2/54.jpg">
				<img class="t2" src="images/t2/thumbs/55.jpg" alt="Pic 55" data-largesrc="images/t2/55.jpg">
				<img class="t2" src="images/t2/thumbs/56.jpg" alt="Pic 56" data-largesrc="images/t2/56.jpg">
				<img class="t2" src="images/t2/thumbs/57.jpg" alt="Pic 57" data-largesrc="images/t2/57.jpg">
			</div>
		</div>
	
	</article>
	
	<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
	<script src="dist/scripts/chromagallery.pkgd.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$(".mygallery").chromaGallery
		    ({
		        color:'#000',
		        gridMargin:15,
		        maxColumns:5,
		        dof:true,
		        screenOpacity:0.8
		    });
			
			//切换
			$('.select').on('click', '.placeholder', function(e) {
				var parent = $(this).closest('.select');
				if (!parent.hasClass('is-open')) {
					parent.addClass('is-open');
					$('.select.is-open').not(parent).removeClass('is-open');
				} else {
					parent.removeClass('is-open');
				}
				e.stopPropagation();
			}).on('click', 'ul>li', function() {
				var parent = $(this).closest('.select');
				parent.removeClass('is-open').find('.placeholder').text($(this).text());
				if($(this).text().indexOf('小儿')!=-1){
					location.href = "t1.html"
				}else{
					location.href = "t2.html"
				}
			});
			 
			$('body').on('click', function() {
				$('.select.is-open').removeClass('is-open');
			});
		});
	</script>
</body>
</html>